网页复杂度指标(WCI)
计算方式
WCI = F(功能)+ I(交互)+ L(布局)+ P(性能)+ E(工程)
功能复杂度 (F, 1–5)
| 分值 |
描述 |
示例 |
| 1 |
静态内容 |
博客、公司官网 |
| 2 |
动态数据展示 |
新闻门户、商品列表 |
| 3 |
基本业务逻辑 |
电商详情页、注册登录 |
| 4 |
多角色逻辑 |
CRM、后台管理系统 |
| 5 |
实时协作/计算 |
Google Docs、WebGL 游戏 |
交互复杂度 (I, 1–5)
| 分值 |
描述 |
示例 |
| 1 |
基础交互(点击、跳转) |
简单导航 |
| 2 |
中级交互(模态框、分页) |
电商搜索页 |
| 3 |
高级交互(拖拽、多层表单) |
看板、表单系统 |
| 4 |
富交互(富文本、画布工具) |
Markdown 编辑器 |
| 5 |
多人实时交互 |
在线白板、协作工具 |
布局/表现复杂度 (L, 1–5)
| 分值 |
描述 |
示例 |
| 1 |
简单栅格/固定布局 |
单页 Landing Page |
| 2 |
响应式 + 常规组件 |
大部分企业站点 |
| 3 |
复杂断点/定制 UI |
电商首页 |
| 4 |
动画、过渡效果 |
交互式营销页面 |
| 5 |
高级视觉(3D、Parallax、WebGL) |
动效官网、3D 展示页 |
性能复杂度 (P, 1–3)
| 分值 |
描述 |
示例 |
| 1 |
数据量小,首屏 <1MB |
普通展示页 |
| 2 |
中等数据量 (1–5MB, DOM 1k–10k) |
电商列表页 |
| 3 |
大规模渲染 (5MB+ / DOM 10k+) |
数据可视化大屏、在线表格 |
工程复杂度 (E, 1–3)
| 分值 |
描述 |
示例 |
| 1 |
单页静态部署 |
博客、官网 |
| 2 |
前后端分离 + API 接入 |
电商平台、CMS |
| 3 |
微前端、多团队协作、国际化 |
SaaS 平台、大型企业门户 |
AI 可代替程度对照表
| WCI 范围 |
复杂度等级 |
典型场景 |
AI 代替能力(2025 年预测) |
| 5–8 |
低复杂度 |
企业官网、博客、简单营销页 |
AI 可完全替代(无需人类介入) |
| 9–14 |
中等复杂度 |
电商站点、后台管理、CMS |
AI + 人类协作(AI 80%,人类做业务逻辑/优化) |
| 15–21 |
高复杂度 |
在线协作工具、WebGL 游戏、复杂可视化平台 |
人类主导,AI 辅助(AI 30%,人类主导架构/性能/交互细节) |